<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html lang="en">
<head>
	<base href="<%=basePath%>">
	<meta charset="utf-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	<!-- basic styles -->
	<link rel="stylesheet" href="assets/css/bootstrap.min.css" />
	<link rel="stylesheet" href="assets/css/bootstrap-responsive.min.css" />
	<link rel="stylesheet" href="assets/css/font-awesome.min.css" />
	<!-- 下拉框 -->
	<link rel="stylesheet" href="assets/css/chosen.css" />
</head>
<body>
	<form id="addForm" action="user/user_save.do" method="post">
		<div class="alert alert-info" style="margin-top:2px;margin-bottom:5px;height:40px;padding-top:10px;padding-bottom:10px;">
			<i class="icon-hand-right"></i>注意：标*的字段为必填项！
		</div>
		<table style="width:100%;border-collapse:separate;border-spacing:5px;">
			<tr>
				<td>用户账号</td>
				<td><input type="text" name="account"  id="account" maxlength="64" onblur="checkAccount();" placeholder="请用您常用邮箱作为用户账号" class="col-xs-10 col-sm-5"/>&nbsp;<span style="color: red">*</span></td>
			</tr>
			<tr>
				<td>用户密码</td>
				<td><input type="password" name="password"  id="password" maxlength="25" placeholder="默认111111"  class="col-xs-10 col-sm-5"/>&nbsp;<span style="color: red">*</span></td>
			</tr>
			<tr>
				<td>用户昵称</td>
				<td><input type="text" name="name"  id="name" maxlength="12"  class="col-xs-10 col-sm-5"/>&nbsp;<span style="color: red">*</span></td>
			</tr>
			<tr>
				<td>用户手机号</td>
				<td><input type="text" name="phone"  id="phone" maxlength="15" onblur="phoneOnble();"  class="col-xs-10 col-sm-5"/>&nbsp;<span style="color: red">*</span></td>
			</tr>
			<tr>
				<td>公司名称</td>
				<td><input type="text" name="company"  id="company" maxlength="32"   class="col-xs-10 col-sm-5"/>&nbsp;<span style="color: red">*</span></td>
			</tr>
			<tr>
				<td>用户账号类型</td>
				<%-- <td>	
				<select name="type" class="chosen-select col-xs-10 col-sm-5" >
						<c:forEach items="${typeUserList}" var="type">
							<option value="${type.id }" >${type.name }</option>
						</c:forEach>
					</select>
				</td>
			</tr>
			<tr> --%>
				<td style="float: center; text-align: center;" colspan="1">充值消费
					<input name="type" type="radio" value="2" checked="checked"
					onclick="recharge();" />&nbsp;&nbsp;&nbsp;&nbsp; 包月包年 <input
					name="type" type="radio" value="1" checked="checked"
					onclick="monthly();" />
				</td>
			</tr>
			<tr id="amount" style="display: none;">
				<td>充值金额(元)</td>
				<td><input type="text" name="amount"  id="amount" maxlength="32" onblur="amountOnblur();"  class="col-xs-10 col-sm-5"/></td>
			</tr>
			<tr id="SingleConsumptionAmount" style="display: none;">
				<td>单价/小时</td>
				<td><input type="text" name="SingleConsumptionAmount"  id="SingleConsumptionAmount" maxlength="32" onblur="SingleConsumptionAmountOnblur();'"  class="col-xs-10 col-sm-5"/></td>
			</tr>
           <tr id="startTime1" >
				<td>开始时间</td>
				<td><input type="text" name="startTime" id="startTime" value="" onclick="laydate()" class="laydate-icon"></td>
			</tr>
			 <tr id="endTime1" >
				<td>结束时间</td>
				<td><input type="text" name="endTime" value=""   onclick="laydate()" id="endTime"  class="laydate-icon"></td>
			</tr>
			<tr>
				<td>直播分辨率</td>
				<td>	
				<select name="video_resolution" class="chosen-select col-xs-10 col-sm-5" >
							<option value="1" >1080p</option>
							<option value="2" >720p</option>
							<option value="3" >640p</option>
							<option value="4" >360p</option>
					</select>
				</td>
			</tr>
			<tr>
				<td>直播频道</td>
				<td>	
				<select name=channel_id class="chosen-select col-xs-10 col-sm-5" >
						<c:forEach items="${getChannelPushList}" var="getChannelPushList">
							<option value="${getChannelPushList.id }" >${getChannelPushList.name}</option>
						</c:forEach>
					</select>
				</td>
			</tr>
			<tr>
				<td>录制功能</td>
				<td>	
				<select name="record" class="chosen-select col-xs-10 col-sm-5" >
							<option value="1" >未开启</option>
							<option value="2" >开启</option>
					</select>
				</td>
			</tr>
			<%-- <tr>
				<td>用户属于供应商</td>
				<td>	
				<select name="agentId" class="chosen-select col-xs-10 col-sm-5" >
						<c:forEach items="${agentList}" var="agent">
							<option value="${agent.id }" >${agent.companyName }</option>
						</c:forEach>
					</select>
				</td>
			</tr> --%>
			<tr>
				<td style="float:center;text-align:center;height:60px;" colspan="2">
					<button type="button" onclick="saveBattery();" class="btn btn-info btn-sm "><i class="icon-edit bigger-120">&nbsp;&nbsp;</i>提交</button>
					<button type="button" onclick="top.Dialog.close();" class="btn btn-info btn-sm "><i class="icon-lightbulb bigger-120">&nbsp;&nbsp;</i>取消</button>
				</td>
			</tr>
		</table>
	</form>
	<script type="text/javascript" src="assets/js/jquery-1.10.2.min.js"></script>
	<!-- 引入 -->
	<script type="text/javascript" src="assets/js/bootstrap.min.js"></script>
	<!-- 下拉框 -->
	<script type="text/javascript" src="assets/js/chosen.jquery.min.js"></script>
	<!--提示框-->
	<script type="text/javascript" src="assets/js/jquery.tips.js"></script>
	<script type="text/javascript" src="assets/js/laydate/laydate.js"></script>
	<script type="text/javascript">
		$(function() {
			$("table tr").find("td:eq(0)").width(120);
		});
		var a = new Date();
		var month = a.getMonth()+1;
		if(month<10){
			month = "0" +month;
		}
		var day = a.getDate();
		if(day<10){
			day = "0" + day;
		}
		$("#startTime").val(a.getFullYear()+"-"+month+"-"+day);
		$("#endTime").val(a.getFullYear()+"-"+month+"-"+day);
		function recharge() {
			var amount = document.getElementById("amount");
			amount.style.display = "table-row";
			var SingleConsumptionAmount = document.getElementById("SingleConsumptionAmount");
			SingleConsumptionAmount.style.display = "table-row";
			var startTime = document.getElementById("startTime1");
			startTime.style.display = "none";
			var endTime = document.getElementById("endTime1");
			endTime.style.display = "none";
		}
		function monthly() {
			var amount = document.getElementById("amount");
			amount.style.display = "none";
			var SingleConsumptionAmount = document.getElementById("SingleConsumptionAmount");
			SingleConsumptionAmount.style.display = "none";
			var startTime = document.getElementById("startTime1");
			startTime.style.display = "table-row";
			var endTime = document.getElementById("endTime1");
			endTime.style.display = "table-row";
		}
		function amountOnblur() {
			var inp = document.getElementById("amount");
			var reg = /^[0-9]+$/;
			var result = reg.test(inp.value);
			if (!result) {
				showTips($("input[name='amount']"),'请输入数字！');
				return false; 
				inp.value = "";
				return false;
			}
		}
		function SingleConsumptionAmountOnblur() {
			var inp = document.getElementById("SingleConsumptionAmount");
			var reg = /^[0-9]+$/;
			var result = reg.test(inp.value);
			if (!result) {
				showTips($("input[name='SingleConsumptionAmount']"),'请输入数字！');
				return false; 
				inp.value = "";
				return false;
			}
		}
		function saveBattery(){
			if($("input[name='account']").val()==""){
				showTips($("input[name='account']"),'请填写用户账号！');
				return false; 
			}
			 var inp = document.getElementById("account");
			 var reg = /^[-a-zA-Z0-9@._]*$/;
				var result = reg.test(inp.value);
				if (!result) {
					$("#account").tips({
						side : 1,
						msg : '存在中文或非法字符!',
						bg : '#0099FF',
						time : 3
					});
					return false;
				}
			 if($("input[name='name']").val()==""){
				showTips($("input[name='name']"),'请填写用户昵称！');
				
				return false;
			}
			 if($("input[name='phone']").val()==""){
					showTips($("input[name='phone']"),'请填写用户手机号！');
					return false;
				}
			 if($("input[name='company']").val()==""){
					showTips($("input[name='company']"),'请填写公司名称！');
					
					return false;
				}
			 var e = $.trim($("#startTime").val());
			 var f = $.trim($("#endTime").val());
			    if(e>f){
			    	$("#endTime").tips({
						side : 1,
						msg : '开始时间要迟于结束时间',
						bg : '#0099FF',
						time : 3
					});
			    	 return false;
			    }
			 var inp = document.getElementById("phone");
				var reg = /^(13[0-9]|15[012356789]|17[678]|18[0-9]|14[57])[0-9]{8}$/;
				var result = reg.test(inp.value);
				if (!result) {
					$("#phone").tips({
						side : 1,
						msg : '手机号格式不对，请重新输入!',
						bg : '#0099FF',
						time : 3
					});
					return false;
				}
				 $.ajax({
						type: "POST",
						url: "user/user_check.do",
						data: { account : $("input[name='account']").val()},
						async: true,
						dataType: "text",
						success: function(data) {
							if(data==1){
								showTips($("input[name='account']"),'账号已存在');
								return false; 
							}else if (data!=1) {
									$("#addForm").submit();
							}
						}
					});
		};
		 function phoneOnble(){
			 	var inp = document.getElementById("phone");
				var reg = /^(13[0-9]|15[012356789]|17[678]|18[0-9]|14[57])[0-9]{8}$/;
				var result = reg.test(inp.value);
				if (!result) {
					$("#phone").tips({
						side : 1,
						msg : '手机号格式不对，请重新输入!',
						bg : '#0099FF',
						time : 3
					});
					return false;
				}
/* 				$.ajax({
					type: "POST",
					url: "user/phone_check.do",
					data: { phone : $("input[name='phone']").val()},
					async: true,
					dataType: "text",
					success: function(data) {
						if(data==1){
							showTips($("input[name='phone']"),'手机号已存在');
							return false; 
						}
					}
				});
 */		}
		function checkAccount(){
			 var inp = document.getElementById("account");
			 var reg = /^[-a-zA-Z0-9@._]*$/;
				var result = reg.test(inp.value);
				if (!result) {
					$("#account").tips({
						side : 1,
						msg : '存在中文或非法字符!',
						bg : '#0099FF',
						time : 3
					});
					return false;
				}
			$.ajax({
				type: "POST",
				url: "user/user_check.do",
				data: { account : $("input[name='account']").val()},
				async: true,
				dataType: "text",
				success: function(data) {
					if(data==1){
						showTips($("input[name='account']"),'账号已存在');
						return false; 
					}
				}
			});
		}
		function showTips(obj,tips) {
			obj.tips({
				side:3,
	            msg:tips,
	            bg:'#e69138',
	            time:2
	        });
		}
	</script>
</body>
</html>